<template>
  <el-card class="form-container" shadow="never">
    <el-steps :active="active" finish-status="success" align-center style="margin-top: 20px">
      <el-step title="填写任务信息"></el-step>
      <el-step title="选择任务地点"></el-step>
      <el-step title="分配任务"></el-step>
    </el-steps>
    <task-info-detail
        v-show="showStatus[0]"
        v-model="taskParam"
        :is-edit="isEdit"
        @nextStep="nextStep"
        @getTaskDetail="getTaskDetail">
    </task-info-detail>
    <task-map-detail
        v-show="showStatus[1]"
        v-model="taskParam"
        :is-edit="isEdit"
        @nextStep="nextStep"
        @getTaskDetail="getTaskDetail"
        @prevStep="prevStep">
    </task-map-detail>
    <task-distribute-detail
        v-show="showStatus[2]"
        v-model="taskParam"
        :is-edit="isEdit"
        @getAddInfo="getAddInfo"
        @prevStep="prevStep"
        @finishCommit="finishCommit"
        @getTaskDetail="getTaskDetail">
    </task-distribute-detail>
  </el-card>
</template>
<script>
import TaskInfoDetail from './TaskInfoDetail.vue';
import TaskMapDetail from './TaskMapDetail.vue';
import TaskDistributeDetail from './TaskDistributeDetail.vue';
import axios from "axios";
const defaultTaskParam = {
  taskAllocation:1,
    selectedCollege:null,
    selectedMajor:null,
    selectedClazz:null,
    studentNumber:"",
    peopleNumber:"",
  name:''

}
export default {
  name: 'AddDetail',
  components: {TaskInfoDetail, TaskMapDetail,TaskDistributeDetail},
  props: {
    isEdit: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      active: 0,
      taskParam: Object.assign({}, defaultTaskParam),
      showStatus: [true, false, false],
      addInfo:{}
    }
  },
  created(){
   /* if(this.isEdit){
      getProduct(this.$route.query.id).then(response=>{
        this.productParam=response.data;
      });
    }*/
  },
  methods: {
    hideAll() {
      for (let i = 0; i < this.showStatus.length; i++) {
        this.showStatus[i] = false;
      }
    },
    getTaskDetail(item){
      console.log('我调用了getTaskDetail',item);
      Object.assign(this.addInfo, item);
      console.log('我接收到了TaskDetail',this.addInfo);
    },
    prevStep() {
      if (this.active > 0 && this.active < this.showStatus.length) {
        this.active--;
        this.hideAll();
        this.showStatus[this.active] = true;
      }
    },
    nextStep() {
      console.log('我调用了nextStep');
      if (this.active < this.showStatus.length - 1) {
        this.active++;
        this.hideAll();
        this.showStatus[this.active] = true;
      }
    },
    finishCommit(isEdit) {
      console.log('你好', isEdit);
      const tip = `当先将任务分配给${this.addInfo.peopleNumber}人，是否要提交该任务?`;
      this.$confirm(tip,  '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        axios.post('/taskManage/addTask', this.addInfo).then(response => {
          if (response.status === 200) {
            this.$message({
              type: 'success',
              message: '提交成功',
              duration: 1000
            });
            location.reload();
          }
        });
      });
    },

  }
}
</script>
<style>
.form-container {
  width: 960px;
}
.form-inner-container {
  width: 800px;
}
</style>


